import React, { useEffect, Suspense } from 'react'
import Router from './router'
import './App.scss'
// import Navbar from './components/Navbar/Navbar'
const Navbar = React.lazy(() => import('./components/Navbar/Navbar'));

// import Footer from './components/Footer/Footer'
const Footer = React.lazy(() => import('./components/Footer/Footer'));

// import Header from './components/Header/Header'
const Header = React.lazy(() => import('./components/Header/Header'));

// import FixedRight from './components/FixedRight/FixedRight'



function App() {
  useEffect(() => {
    // console.log(particlesJS)
    // particlesJS.load('particles-js');
  }, [])


  return (
    <div className='app'>
      <Suspense fallback={<div>页面加载中...</div>}>
        <Header></Header>
        <Navbar></Navbar>
        <div className='app-content main-padding-left'>
          <div className='app-cintainer'>
            <Router />
          </div>
          <div>
            {/* <FixedRight></FixedRight> */}
          </div>
        </div>
        <Footer></Footer>
      </Suspense>
    </div>
  );
}

export default App;
